<template id="payDaily">
  <div class="payDaily">
    <div class="row payDailyHeader">
      <p class="payDailyName col_333">{{hadPayObj.projectName}}</p>
      <p class="payDailyCost col_0ae">{{hadPayObj.factAmt | formatNumber}}元</p>
    </div>
    <div class="row payDailyList">
      <div class="col ListInfo">
        <span>缴费用户</span>
        <span class="col_333">{{hadPayObj.feeUserName}}</span>
      </div>
    </div>
    <div class="row payDailyList">
      <div class="col ListInfo">
        <span>缴费编号</span>
        <span class="col_333">{{hadPayObj.feeId}}</span>
      </div>
    </div>
    <div class="row payDailyList">
      <div class="col ListInfo">
        <span>缴费流水号</span>
        <span class="col_333">{{hadPayObj.payId}}</span>
      </div>
    </div>
    <div class="row payDailyList">
      <div class="col ListInfo" style="border-bottom: none;height: 0.44rem">
        <span>交易时间</span>
        <span class="col_333">{{new Date(hadPayObj.formatPayDate*1000) | textFormate_hms}}</span>
      </div>
    </div>
    <div class="row payDailyList" style="margin-top: 0.1rem">
      <div class="col ListInfo" style="border-bottom: none;height: 0.44rem;position: relative">
        <span>支付方式</span>
        <!--微信支付-->
        <div class="payWayBox" v-if="hadPayObj.payType == '01' ">
          <div class="col_333 payWay" >线下收费 (POS)</div>
        </div>
        <div class="payWayBox" v-else-if="hadPayObj.payType == '02'" >
          <div class="col_333 payWay" >线下收费 (现金)</div>
        </div>
        <!--银行卡样式-->
        <div class="cdCardBox" v-else="">
          <i class="icon iconfont icon-cdCardBox"></i>
          <span class="col_333 cdCardBoxSty">中国银行借记卡 (尾号{{hadPayObj.payType.slice(-4)}})</span>

        </div>

      </div>
    </div>

  </div>
</template>

<script>
  import Vue from 'vue'

  Vue.filter( 'textFormate_hms' , function(value) {
    return value.Format('yyyy-MM-dd hh:mm:ss') ;
  });
  import logo from '../../assets/image/bannerLogo1.png'
  export default {
    data(){
      return {
        isCord:false,
        hadPayObj: {}
      }
    },
    methods: {

    },

    created: function () {
      this.hadPayObj = this.$route.query;
      console.log(this.hadPayObj);
    }

  }
</script>

<style scoped>
  @import "../../style/common.css";
  @import "../../assets/css/iconfont.css";
  .payDailyHeader{
    height: 1.06rem;
    background-color: #fff;
    position: relative;
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
  }
  .payDailyName{
    font-size: 0.14rem;
    position: absolute;
    top: 0.31rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);

  }
  .payDailyCost{
    font-size: 0.24rem;
    position: absolute;
    top: 0.62rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .payDailyList{
    background-color: #fff;

  }
  .ListInfo{
    height: 0.435rem;
    border-bottom: 1px solid #eee;
  }
  .ListInfo span{
    line-height: 0.44rem;

  }
  .ListInfo span:first-child{
    padding-left: 0.1rem;
    display: inline-block;
    width: 0.9rem;
    font-size: 0.13rem;
    color: #999;
  }
  .ListInfo span:last-child{
    font-size: 0.14rem;
  }
  .payWay{
    height: 0.44rem;
    background-color: #fff;
    margin-right: 0.1rem;
    font-size: 0.14rem;

  }
  .icon-payWay{
    font-size: 0.17rem;
    color: #24af41;


  }
  .payWayBox{
    height: 100%;
    float: right;
    right: 0;
    line-height: 0.44rem;
  }
  .payLogo{
    height: 0.25rem;
    position: absolute;
    left: 0;
    top:50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  .cdCardBox{
    height: 100%;
    width: 80%;
    position: absolute;
    right: 0;
    top: 0;
    text-align: right;


  }

  .icon-cdCardBox{
    display: inline-block;
    width: 0.2rem;
    height: 0.2rem;
    background-image: url("../../assets/image/paysign3.png");
    -webkit-background-size:0.2rem;
    -o-background-size: 0.2rem;
    background-size:0.2rem;
    background-repeat: no-repeat;
    margin-top: 0.12rem;

  }

  .cdCardBoxSty{
    float: right;
    padding-left: 0.1rem;
    padding-right: 0.1rem;

  }
</style>
